<?php
// coding: utf-8

header('Cache-Control: no-cache, must-revalidate');
header('Expires: Mon, 26 Jul 1997 05:00:00 GMT');

class Page
{
	private $_htmlContent = '';
	private $_phpContent = '';
	private $_dom;
	private $_itemlist;

	function __construct($docContent)
	{
		$indexHtml = strpos($docContent, '<ht'.'ml');
		$this->_phpContent = substr($docContent, 0, $indexHtml);
		$this->_htmlContent = substr($docContent, $indexHtml);
		$this->_dom = new DOMDocument();
		$this->_dom->loadHTML($this->_htmlContent);
		$this->_itemlist = $this->_dom->getElementById('itemlist');
	}

	public function ClearItemList()
	{
		while ($this->_itemlist->hasChildNodes())
			$this->_itemlist->removeChild($this->_itemlist->firstChild);
	}

	public function AddItems($items)
	{
		$i = 1;
		foreach ($items as $item)
		{
			if  (trim($item) == '') continue;

			$li = $this->_dom->createElement('li');

			$checkbox = $this->_dom->createElement('input');
			$checkbox->setAttribute('type', 'checkbox');
			$checkbox->setAttribute('id', 'item_' . $i);
			$checkbox->setAttribute('value', $i);
			$li->appendChild($checkbox);

			$label = $this->_dom->createElement('label');
			$label->setAttribute('for', 'item_' . $i);
			$label->nodeValue = stripslashes(trim($item));
			$li->appendChild($label);
			
			$i++;

			$this->_itemlist->appendChild($li);
		}
	}

	public function GetFileContent()
	{
		$this->_htmlContent = $this->_dom->saveHTML();
		// Clears the doctype header
		$this->_htmlContent = substr($this->_htmlContent, strpos($this->_htmlContent, '<ht'.'ml'));
		return $this->_phpContent.$this->_htmlContent;
	}
}

function GenerateManifest() {
	$s = "CACHE MANIFEST\n";
	$s .= "#rev " . time() . "\n";
	//$s .= "index.php5\n";
	
	file_put_contents('courses.appcache', $s);
}

if (isset($_POST['listedit']))
{

    // Gets the submitted items
    $newitems = explode("\n", $_POST['listedit']);

    // Loads the document
    $doc = new Page(file_get_contents('index.php5'));

	// Clears the list
	$doc->ClearItemList();

    // Adds the new items
	$doc->AddItems($newitems);

    file_put_contents('index.php5', $doc->GetFileContent());
	
	// Updates the cache manifest
	GenerateManifest();

    header('Location: http://'.$_SERVER['HTTP_HOST'].dirname($_SERVER['PHP_SELF']));

}
?>
<html manifest="manifest.php">
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<title>Liste de courses</title>
<script type="text/javascript">
            function $(e) { return document.getElementById(e); }

            function switchEdit()
            {
                if ($('edit').style.display == 'block')
                {
                    $('edit').style.display = 'none';
                    $('data').style.display = 'block';
                }
                else
                {
                    list2edit();
                    $('edit').style.display = 'block';
                    $('data').style.display = 'none';
                }
				return false;
            }

            function list2edit()
            {
                var s = "";
                var labels = document.getElementsByTagName("label");

                for (var i in labels)
                {
                    if (labels[i].innerHTML)
                        s += labels[i].innerHTML + '\n';
                }
                $('listedit').value = s;
            }
			
			if (window.applicationCache) {
				window.applicationCache.addEventListener('updateready', function(){
					location.reload();
				}, false);
			}
			
       </script><style type="text/css">
            body, h1, label { font-family: sans-serif; font-size: 16pt }
            h1 { font-weight: bold }       
            #itemlist { list-style-type: none; margin: 0; padding: 0 }
            #itemlist li { padding: 0.3em 0 }
            #edit { display: none }
            input:checked + label { text-decoration: line-through; color: #888 }
        </style>
</head>
<body>
        <h1>Liste de courses</h1>
        <div id="data">
			<form action="." method="post">
				<ul id="itemlist" xml:id="itemlist"></ul>
				<p><button type="button" onclick="switchEdit()">Modifier</button></p>
			</form>
        </div>
        <div id="edit">
            <form action="." method="post">
            <p>Saisir tous les éléments de la liste, un par ligne.</p>
            <textarea id="listedit" name="listedit" rows="20" cols="50"></textarea><br><button type="submit">Sauver</button> <button type="button" onclick="switchEdit()">Annuler</button>
            </form>
        </div>
    </body>
</html>
